<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>教练新增</title>
    <link href="../../layui/css/layui.css" rel="stylesheet">
    <link href="../../static/css/style.css" rel="stylesheet">
    <script src="../../static/js/jquery.min.js"></script>
    <script src="../../static/js/jquery.cookie.js"></script>
    <script src="../../static/js/base.js"></script>
    <script src="../../static/js/ax.js"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
    <script src="../../static/js/html5.js"></script>
    <script src="../../static/js/respond.js"></script>
    <![endif]-->
    <style>
         .layui-upload-list{
         width: 110px;
         height: 100px;
         
     }
     .layui-upload-list img{
        max-width: 110px;
         max-height: 100px;  
     }
    </style>
</head>

<body>

    <div class="layui-card xyxx">
        <div class="layui-card-header">
            <h5>教练新增</h5>
        </div>
        <div class="layui-card-body">
            <form class="layui-form layui-form-pane" action="" lay-filter="component-form-element">
                <div class="layui-row layui-col-space10">
                    <div class="layui-inline  layui-col-sm6">
                        <label class="layui-form-label">教练编号：</label>
                        <div class="layui-input-block">
                            <input type="text" name="coachNumber" class="layui-input" id="coachNumber" readonly>
                        </div>
                    </div>
                    <div class="layui-inline  layui-col-sm6">
                        <label class="layui-form-label">性别：</label>
                        <div class="layui-input-block">
                            <input type="radio" name="sex" value="man" title="男" checked="">
                            <input type="radio" name="sex" value="woman" title="女">
                        </div>
                    </div>
                    <div class="layui-inline  layui-col-sm6">
                        <label class="layui-form-label">教练姓名：</label>
                        <div class="layui-input-block">
                            <input type="hidden" lay-verify="required" class="layui-input" id="id" name="id">
                            <input type="text" class="layui-input" id="name" name="name">
                        </div>
                    </div>
                    <div class="layui-inline  layui-col-sm6">
                        <label class="layui-form-label">证件号码：</label>
                        <div class="layui-input-block">
                            <input type="text" lay-verify="required|identity" class="layui-input" id="idnum" name="idnum">
                        </div>
                    </div>
                    <div class="layui-inline  layui-col-sm6">
                        <label class="layui-form-label">手机号码：</label>
                        <div class="layui-input-block">
                            <input type="text" class="layui-input" lay-verify="required|phone" id="phone" name="phone">
                        </div>
                    </div>
                    <div class="layui-inline  layui-col-sm6">
                        <label class="layui-form-label">微信号：</label>
                        <div class="layui-input-block">
                            <input type="text" class="layui-input" id="wechat" name="wechat">
                        </div>
                    </div>
                    <div class="layui-inline  layui-col-sm6">
                        <label class="layui-form-label">教龄：</label>
                        <div class="layui-input-block">
                            <input type="text" class="layui-input" id="teachingage" name="teachingage">
                        </div>
                    </div>
                    <div class="layui-inline layui-col-sm6">
                        <label class="layui-form-label">教练培训科目：</label>
                        <div class="layui-input-block">
                            <input type="checkbox" name="subject" title="科目一" value="1" lay-skin="primary">
                            <input type="checkbox" name="subject" title="科目二" value="2" lay-skin="primary">
                            <input type="checkbox" name="subject" title="科目三" value="3" lay-skin="primary">
                            <input type="checkbox" name="subject" title="科目四" value="4" lay-skin="primary">
                        </div>
                    </div>
                    <div class="layui-inline layui-col-sm6 driveCarTypeF">
                        <label class="layui-form-label">培训车型：</label>
                        <div class="layui-input-block trainCartype">
                        </div>
                    </div>
                    <div class="layui-inline layui-col-sm6 driveCarTypeF">
                        <label class="layui-form-label">教练驾驶车型：</label>
                        <div class="layui-input-block driversCartype" >
                        </div>
                    </div>
                </div>
                <div class="layui-row layui-col-space10">
                    <div class="layui-inline  layui-col-sm4">
                        <label class="layui-form-label">教练驾驶证：</label>
                        <div class="layui-input-block">
                            <div class="layui-upload-drag">
                                <i class="layui-icon layui-icon-add-1 addCoachCard"></i>
                            </div>
                            <div class="layui-upload-list">
                                <img class="layui-upload-img" id="coachCardImg">
                                <p id="demoText"></p>
                                <input type="hidden" name="coachCard" id="coachCard" />
                            </div>
                        </div>
                    </div>
                    <div class="layui-inline  layui-col-sm4">
                        <label class="layui-form-label">教练证：</label>
                        <div class="layui-input-block">
                            <div class="layui-upload-drag">
                                <i class="layui-icon layui-icon-add-1 addCoachLicense"></i>
                            </div>
                            <div class="layui-upload-list">
                                <img class="layui-upload-img" id="coachLicenseImg">
                                <p id="demoText2"></p>
                                <input type="hidden" name="coachLicense" id="coachLicense" />
                            </div>
                        </div>
                    </div>
                    <div class="layui-inline  layui-col-sm4">
                        <label class="layui-form-label">教练头像：</label>
                        <div class="layui-input-block">
                            <div class="layui-upload-drag">
                                <i class="layui-icon layui-icon-add-1 addCoachHead"></i>
                            </div>
                            <div class="layui-upload-list">
                                <img class="layui-upload-img" id="coachHeadImg">
                                <p id="demoText3"></p>
                                <input type="hidden" name="coachHead" id="coachHead" />
                            </div>
                        </div>
                    </div>

                </div>


                <div class="layui-form-item layui-form-text mrgintop">
                    <label class="layui-form-label">教练描述：</label>
                    <div class="layui-input-block">
                        <textarea placeholder="请输入内容" class="layui-textarea" id="coachDescribe" name="coachDescribe"></textarea>
                    </div>
                </div>



                <h5 class="lheight">教练标签：</h5>
                <div class="layui-row layui-col-space10 mrgintop">

                    <div class="layui-col-sm8">
                        <span class="layui-badge-rim train_rim">诚实可靠
                            <i class="layui-icon layui-icon-close"></i>
                        </span>
                        <span class="layui-badge-rim train_rim">技术一流
                            <i class="layui-icon layui-icon-close"></i>
                        </span>
                        <span class="layui-badge-rim train_rim">面目和善
                            <i class="layui-icon layui-icon-close"></i>
                        </span>
                    </div>
                    <div class="layui-col-sm4">
                        <a class="layui-btn add_btn">增加标签</a>
                        <a class="layui-btn add_btn">选择标签</a>
                    </div>




                </div>


                <!--模板-->


                <div class="layui-form-item layui-col-space10">
                    <div class="layui-input-block">
                        <a id="btnClose" class="layui-btn layui-btn-primary btn-left">关闭</a>
                        <button class="layui-btn btn-left" lay-submit lay-filter="component-form-element">提交</button>

                    </div>
                </div>
            </form>
        </div>
    </div>

    <script src="../../layui/layui.js"></script>
</body>

<script>

    var table;
    $(function () {
        ax.post({
            url: schoolWebUrl+'/api/dict/getDict',
            contentType: "application/x-www-form-urlencoded",
            data:{"code":"car"},
            success: function (r) {
                var data=r.data;
                for(var i=0;i<data.length;i++){
                    $(".trainCartype").append('  <input type="checkbox" name="trainCartype" title="'+data[i].name+'" value="'+data[i].id+'" lay-skin="primary">');
                    $(".driversCartype").append('  <input type="checkbox" name="driversCartype" title="'+data[i].name+'" value="'+data[i].id+'" lay-skin="primary">');
                }
            },
        });

        var postData = { "id": getQueryString("id") }
        ax.post({
            type: 'POST',
            url: schoolWebUrl + '/api/coach/info',
            contentType: "application/x-www-form-urlencoded",
            data: postData,
            success: function (r) {
                var data = r.data;
                //描述
                $("#coachDescribe").val(data.coachDescribe);
                //教练编号
                $("#coachNumber").val(data.coachNumber);
                //证件号码
                $("#idnum").val(data.idnum);
                //labe;
                $("#label").val(data.label);
                $("#name").val(data.name);
                $("#phone").val(data.phone);
                $("#sex").val(data.sex);
                if (data.sex == "man") {
                    $("input[name=sex][value='man']").attr("checked", true);
                } else {
                    $("input[name=sex][value='woman']").attr("checked", true);
                }
                setTimeout(function () {
                    layui.form.render('radio');
                }, 100)
                //培训科目
                var subject = $("input[name='subject']");
                for (i = 0; i < subject.length; i++) {
                    var val = subject[i].value;
                    if (data.subject.split(',').indexOf(val) != -1) {
                        subject[i].checked = true;
                    }
                }
                //培训车型
                var trainCartype = $("input[name='trainCartype']");
                for (i = 0; i < trainCartype.length; i++) {
                    var val = trainCartype[i].value;
                    if (data.trainCartype.split(',').indexOf(val) != -1) {
                        trainCartype[i].checked = true;
                    }
                }
                //培训车型
                var driversCartype = $("input[name='driversCartype']");
                for (i = 0; i < driversCartype.length; i++) {
                    var val = driversCartype[i].value;
                    if (data.driversCartype.split(',').indexOf(val) != -1) {
                        driversCartype[i].checked = true;
                    }
                }
                setTimeout(function () {
                    layui.form.render('radio');
                }, 100)
                //教龄
                $("#teachingage").val(data.teachingage);
                //培训车型
                $("#trainCartype").val(data.trainCartype);
                setTimeout(function () {
                    layui.form.render('radio');
                }, 100)
                $("#wechat").val(data.wechat);
                $("#id").val(data.id);
                if (data.coachCard != null) {
                    $("#coachCardImg").attr('src', fileShowUrl + '?id=' + data.coachCard);
                    $("#coachCard").val(data.coachCard);
                }
                if (data.coachLicense != null) {
                    $("#coachLicenseImg").attr('src', fileShowUrl + '?id=' + data.coachLicense);
                    $("#coachLicense").val(data.coachLicense);
                }
                if (data.coachHead != null) {
                    $("#coachHeadImg").attr('src', fileShowUrl + '?id=' + data.coachHead);
                    $("#coachHead").val(data.coachHead);
                }
                setTimeout(function () {
                    form.render();
                }, 100)
            },
        });
    });
    layui.use(['table', 'form', 'laydate', 'layer', 'upload', 'element', 'util', 'jquery'], function () {
        table = layui.table;
        var form = layui.form,
            laydate = layui.laydate,
            layer = layui.layer,
            $ = layui.jquery,
            upload = layui.upload,
            element = layui.element;

        //常规用法
        laydate.render({
            elem: '#activeTime'
            , range: true
        });

        //单张图片
        //教练驾驶证
        ax.upload({
            elem: '.addCoachCard',
            url: fileUploadUrl + "?appId=" + appId + "&userId=" + currentUserId + "&type=" + type,
            before: function (obj) {
                $("#coachCardImg").attr('src', "");
                $("#coachCard").val("");
                //预读本地文件示例，不支持ie8
                /*obj.preview(function(index, file, result){
                    $('#demo1').attr('src', result); //图片链接（base64）
                });*/
            },
            done: function (res) {
                //上传成功
                $("#coachCardImg").attr('src', fileShowUrl + '?id=' + res.data);
                $("#coachCardImg").attr('width', '112px');
                $("#coachCardImg").attr('height', '100px');
                $("#coachCard").val(res.data);
            }
        });
        //教练证
        ax.upload({
            elem: '.addCoachLicense',
            url: fileUploadUrl + "?appId=" + appId + "&userId=" + currentUserId + "&type=" + type,
            before: function (obj) {
                $("#coachLicenseImg").attr('src', "");
                $("#coachLicense").val("");
                //预读本地文件示例，不支持ie8
                /*obj.preview(function(index, file, result){
                    $('#demo1').attr('src', result); //图片链接（base64）
                });*/
            },
            done: function (res) {
                //上传成功
                $("#coachLicenseImg").attr('src', fileShowUrl + '?id=' + res.data);
                $("#coachLicenseImg").attr('width', '112px');
                $("#coachLicenseImg").attr('height', '100px');
                $("#coachLicense").val(res.data);
            }
        });
        //教练头像
        ax.upload({
            elem: '.addCoachHead',
            url: fileUploadUrl + "?appId=" + appId + "&userId=" + currentUserId + "&type=" + type,
            before: function (obj) {
                $("#coachHeadImg").attr('src', "");
                $("#coachHead").val("");
                //预读本地文件示例，不支持ie8
                /*obj.preview(function(index, file, result){
                    $('#demo1').attr('src', result); //图片链接（base64）
                });*/
            },
            done: function (res) {
                //上传成功
                $("#coachHeadImg").attr('src', fileShowUrl + '?id=' + res.data);
                $("#coachHeadImg").attr('width', '112px');
                $("#coachHeadImg").attr('height', '100px');
                $("#coachHead").val(res.data);
            }
        });

        //form提交
        form.on("submit(component-form-element)", function (data) {
            var subject = new Array();
            var trainCartype = new Array();
            var driversCartype = new Array();
            $("input:checkbox[name='subject']:checked").each(function(i){
                subject[i] = $(this).val();
            });
            $("input:checkbox[name='trainCartype']:checked").each(function(i){
                trainCartype[i] = $(this).val();
            });
            $("input:checkbox[name='driversCartype']:checked").each(function(i){
                driversCartype[i] = $(this).val();
            });
            data.field.subject=subject.toString();
            data.field.trainCartype=trainCartype.toString();
            data.field.driversCartype=driversCartype.toString();
            var index = layer.load(0, {shade: false});
            ax.post({
                url: schoolWebUrl + "/api/coach/update",
                data: data.field,
                contentType: "application/x-www-form-urlencoded",
                success: function (r) {
                    layer.close(index);
                    layer.alert(r.message);
                    setTimeout(function () {
                        topFrame.location.reload();
                        parent.layer.close(parent.layer.getFrameIndex(window.name));
                    },1000)
                },
            });
            return false;
        });
        // $('.close').on('click', function () {
        //     reset();
        // });

        $('#btnClose').on("click", function () {
            parent.layer.close(parent.layer.getFrameIndex(window.name));
        });
    });

    $('.train_rim i').click(function () {
        $(this).parent().remove();
    });
    //重置页面
    function reset() {
        //执行重载
        table.reload('testReload', {
            page: {
                curr: 1 //重新从第 1 页开始
            }
            , where: {
            }
        });
    }

</script>

</html>